<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
	<link rel="stylesheet" href="${ctx}/res/js/thirdParty/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="${ctx}/res/js/thirdParty/zTree_v3/js/jquery.ztree.core-3.5.js"></script>
		<script type="text/javascript" src="${ctx}/res/js/userManagement/userList.js"></script>
		
		<style type="text/css">
		.menuContent {
			border:1px solid black;
			display:none;
			background-color:white;
			width:313px;
			height:300px;
			position:absolute;
			z-index:9999;
			overflow:auto;
		}
		option {
			height: 32px;
			line-height:32px;
			font-size:14px;
			
		}
		option:hover {
			background-color:#4499EE;
		}
		option:selected {
			background-color:#3265e8;
		}
	</style>
	</head>
	<body>
		<center>
			<table>
			<!-- 查询条件区域 -->
				<tr>
					<td>
						<div class="list_query">
						    <table>
								<form  method="post" id="queryForm">
								    <tr>
										<td>
											<label>USERNAME/CN_NAME</label>
										</td>
										<td>
											<input type="text" style="margin-top:10px;" name="username" placeholder="请输入USERNAME/CN NAME" id="username" maxlength="12" value="${username }"/>
											<input type="hidden" name="pageType" id="pageType" value="${pageType }" />
										</td>
										<td>
											<label>DEPT_NAME</label>
										</td>
										<td>
											<input type="text" style="margin-top:10px;width: 300px;" name="dept_name" placeholder="----请选择部门----" id="dept_name" maxlength="30" value="${dept_name }"
											readonly    onclick="showMenu(); return false;"/>
											<input id="dept_id" type="hidden" value="${dept_id }" name="dept_id" />
											<div id="menuContent" class="menuContent" >
												<ul id="departmentTree" class="ztree" style="margin-top:0;width:310px;"></ul>
											</div>		
										</td>
										<td>
											<label>ONLINE_STATUS</label>
										</td>
										<td>
											<select id="online_status" name="online_status" style="width:220px;height:32px;font-size:15px;margin-left:20px;"  >
													<option value="">请选择ONLINE_STATUS</option>
													<option value="online">在线</option>
													<option value="outline">离线</option>									
											</select>											
										</td>
									<tr>
								</form>
							</table>
						</div>
					</td>
				</tr>
			
				<!-- 按钮操作区域 -->
				<tr>
					<td>
						<div class="list_toolbar">
							<div class="toolButton" onclick="queryUserList()">查询</div>
							<div class="toolButton" onclick="createUser()">新建</div>
							<div class="toolButton" onclick="updateUser()">修改</div>
							<div class="toolButton" onclick="deleteUser()">删除</div>
							<div class="toolButton" onclick="enforceUserExit()">强制下线</div>
						</div>
					</td>
				</tr>
			
				<!-- 表头区域 -->
				<tr>
					<td>
						<table class="list_grid">
							<thead>
								<tr>
									<th >USERNAME</th>
									<th >DEPT_NAME</th>
									<th >CN_NAME</th>
									<th >EMAIL</th>
									<th	>ROLE_NAME</th>
									<th	>ONLINE_STATUS</th>
									<th style="width: 1px;"></th>
								</tr>
							</thead>
						</table>
					</td>
				</tr>
				
				<!-- 数据区域 -->
				<tr>
					<td>
						<div class="list_scrollControlDiv">
							<table class="list_grid" style="border-spacing: 0;">
								<tbody id="tBodyList">
								</tbody>
							</table>
						</div>
					</td>
				</tr>
			
				<!-- 分页控件区域 -->
				<tr>
					<td>
						<div id="pagination" class="pagination"></div>
					</td>
				</tr>
			</table>	
		</center>		
		<!-- 隐藏表单，存储选中的username信息 -->
		<form id="submitForm" method="post" action="${ctx}/userManagement/userDetails.do">
			<input type="hidden" name="username"/>
		</form>
		<form id="submitForm2" method="post" action="${ctx}/userManagement/exitUser.do">
			<input type="hidden" name="createUser"/>
			<input type="hidden" name="pageType" value="lastest" />
		</form>	
	</body>
</html>